<!DOCTYPE html>

<html>

<head>
    <title></title>
    <script src='../vue.js'></script>    
</head>

<body>
    <div id="app-1">
        <button v-on:click="show = !show">
            Toggle
        </button>
        <transition name="fade">
            <p v-if="show">hello</p>
        </transition>
    </div>
    <script>
        new Vue({
            el: '#app-1',
            data: {
                show: true
            }
        })
    </script>
</body>

<style>
    .fade-enter-active,
    .fade-leave-active {
        transition: opacity .5s
    }

    .fade-enter,
    .fade-leave-to {
        opacity: 0
    }
</style>
</html>